<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"></meta>
     <link rel="stylesheet" type="text/css" href="dist/css/index.css" />
     <link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_1i0kmddp1pi1wcdi.css">
    <link rel="stylesheet" type="text/css" href="http://cdn.bootcss.com/font-awesome/4.6.3/css/font-awesome.css">
    <link rel="stylesheet" type="text/css" href="dist/css/swiper.min.css" />
   <!--  <link rel="stylesheet" type="text/css" href="css/swiper.min.css">
    <script src="js/swiper.js"></script> -->
    <title>Document</title>
     <script src="dist/js/swiper.js"></script>
    <script src="dist/js/jquery-3.1.1.js"></script>
    <script src="dist/js/index.js"></script>
    <script src="dist/js/touch.js"></script>
    <script src="dist/js/startMove.js"></script>

</head>
<body>
    <header>
        <div class="con-wrap">
            <div class="con">
                <div class="scan">
                    <i class="fa fa-qrcode"></i>
                    <p>扫一扫</p>
                </div>
                <form>
                   <input type="text" class="txt" placeholder="&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;请输入查询商品" />
                    <i class="ii iconfont icon-fangdajing1"></i>
                    <i class="iii iconfont icon-yuyin"></i>
                </form>
                <div class="scan1 scan">
                    <i class="ff fa fa-commenting-o"></i>
                    <p>消息</p>
                </div>
            </div>

            <div class="ul-wrap">
            <ul class="ul">
                <li class="list"><a href="##" class="aa">推荐</a></li>
                <li class="list"><a href="##" class="aa">女装</a></li>
                <li class="list"><a href="##" class="aa">内衣</a></li>
                <li class="list"><a href="##" class="aa">男装</a></li>
                <li class="list"><a href="##" class="aa">美国馆</a></li>
                <li class="list"><a href="##" class="aa">名品馆</a></li>
            </ul>
        </div>
        </div>
        <div class="wrap"></div>
    </header>

    <section>
        <div class="main-wrap">
            <div class="main">
                <!-- 轮播图 -->
                <div class="swiper-container">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide">
                            <img src="dist/img/img01.jpg" class="img-0" />
                        </div>
                        <div class="swiper-slide">
                            <img src="dist/img/img02.jpg" class="img-0" />
                        </div>
                        <div class="swiper-slide">
                            <img src="dist/img/img03.gif" class="img-0" />
                        </div>
                        <div class="swiper-slide">
                            <img src="dist/img/img04.jpg" class="img-0" />
                        </div>
                        <div class="swiper-slide">
                            <img src="dist/img/img05.jpg" class="img-0" />
                        </div>
                    </div>
                    <!-- 如果需要分页器 -->
                    <div class="swiper-pagination"></div>
                </div>
                <!-- 静态图片 -->
                <div class="pic">
                     <img src="dist/img/in05.gif" class="img-1" />
                </div>
                <!-- 图标 -->
                <div class="main-pic">
                    <ul class="main-pic-ul">
                        <li class="ll">
                            <i class="iconfont icon-quan yellow"></i>
                            <p class="quan">领券中心</p>
                        </li>
                        <li class="ll">
                            <i class="iconfont icon-xin pink"></i>
                            <p class="quan">新品专区</p>
                        </li>
                        <li class="ll">
                            <i class="iconfont icon-shishang yellow1"></i>
                            <p class="quan">时尚专栏</p>
                        </li>
                        <li class="ll">
                            <i class="iconfont icon-icon-discont green"></i>
                            <p class="quan">折扣区</p>
                        </li>
                        <li class="ll">
                            <i class="iconfont icon-us purple"></i>
                            <p class="quan">美国馆</p>
                        </li>
                        <li class="ll">
                            <i class="iconfont icon-xingehanyu red"></i>
                            <p class="quan">韩国馆</p>
                        </li>
                        <li class="ll">
                            <i class="iconfont icon-fushineiyi pink1"></i>
                            <p class="quan">内衣馆</p>
                        </li>
                        <li class="ll">
                            <i class="iconfont icon-nanzhuang blue"></i>
                            <p class="quan">男装馆</p>
                        </li>
                    </ul>
                </div>
                <!-- 通知 -->
                <div class="Notice">
                    <!-- 左边 -->
                    <div class="left">
                        <p class="mb">
                            <span>梦芭莎</span>
                            <b>快报</b>
                        </p>
                    </div>
                    <!-- 右边 -->
                     <div class="right " id="right">
                        <ul class="right-ul">
                            <li class="noc">
                                <p class="lb"><span>提前购</span>&nbsp;年终盛典提前购，比12.12更划算的剁手节</p>
                            </li>
                            <li class="noc">
                                <p class="lb"><span>时尚经</span>&nbsp;裤袜挑的好，长腿秀的早</p>
                            </li>
                            <li class="noc">
                                <p class="lb"><span>暖冬潮</span>&nbsp;全球最会穿的时尚博主</p>
                            </li>
                        </ul>
                    </div>
                </div>

            </div>
        </div>
        <!-- 专题 -->
        <div class="content">
        <!-- 背景红黄色 -->
            <div class="con-top">
            <!-- 12.12攻略 -->
                <div class="con-header">
                    <div class="font">
                        <span>SHOPPING FESTIVAL</span>
                        <h1>12.12省钱攻略抢先看</h1>
                    </div>
                    <div class="font-bottom">
                        <img src="dist/img/con02.gif" class="img-2" />
                        <img src="dist/img/con03.gif" class="img-2" />
                        <img src="dist/img/con04.gif" class="img-2" />
                        <img src="dist/img/con05.gif" class="img-2" />
                    </div>
                </div>
                <!-- 限时抄底 -->
                <div class="con-pic">
                        <h2>限时抄底 比12.12更划算</h2>
                        <div class="con-pic-bottom">
                            <img src="dist/img/con06.gif" class="img-3 img-33" />
                            <img src="dist/img/con07.gif" class="img-3 img-34" />
                        </div>
                </div>
                <!-- 热销品类 -->
                <div class="con-sort">
                      <h2 class="rx">热销品类</h2>
                      <div class="rx-pic">
                        <div class="rx-pic-wrap">
                            <img src="dist/img/con16.gif" class="img-4" />
                            <p class="pic-title">羽绒/棉服</p>
                        </div>
                          <div class="rx-pic-wrap">
                            <img src="dist/img/con09.gif" class="img-4" />
                            <p class="pic-title">风衣/大衣</p>
                        </div>
                        <div class="rx-pic-wrap">
                            <img src="dist/img/con10.gif" class="img-4" />
                            <p class="pic-title">裙装</p>
                        </div>
                        <div class="rx-pic-wrap">
                            <img src="dist/img/con11.gif" class="img-4" />
                            <p class="pic-title">保暖打底</p>
                        </div>
                        <div class="rx-pic-wrap">
                            <img src="dist/img/con12.gif" class="img-4" />
                            <p class="pic-title">内衣</p>
                        </div>
                        <div class="rx-pic-wrap">
                            <img src="dist/img/con13.gif" class="img-4" />
                            <p class="pic-title">西装外套</p>
                        </div>
                        <div class="rx-pic-wrap">
                            <img src="dist/img/con14.gif" class="img-4" />
                            <p class="pic-title">毛衣/毛衫</p>
                        </div>
                        <div class="rx-pic-wrap">
                            <img src="dist/img/con15.gif" class="img-4" />
                            <p class="pic-title">裤装</p>
                        </div>

                      </div>
                </div>
            </div>
        </div>
        <!-- 专题 -->
        <div class="topics">
        <!-- top -->
            <div class="topics-top">
            <!-- 品牌推荐 -->
                <div class="brand">
                    <div class="top-title">
                        <h3 class="hh">品牌推荐</h3>
                        <span class="sp">Brand</span>
                    </div>
                    <div class="swiper-container brand-pic-wrap">
                        <div class="swiper-wrapper brand-pic">
                            <div class="swiper-slidel pic-moda">
                                <!-- <div class=" pic-moda"> -->
                                    <img src="dist/img/con17.jpg" class="img-5" />
                                    <img src="dist/img/con18.gif" class="img-5" />
                                    <img src="dist/img/con07.gif" class="img-5" />

                                <!-- </div> -->

                            </div>

                        </div>
                    </div>
                </div>

            </div>
        </div>
    </section>
    <footer>
        <div class="bottom">
            <ul class="list-wrap">
                <li class="list1">
                    <i class="iconfont icon-zhuye"></i>
                    <p class="pi">梦芭莎</p>
                </li>
                <li class="list1">
                    <i class="iconfont icon-fenlei1"></i>
                    <p class="pi">分类</p>
                </li>
                <li class="list1">
                    <i class="iconfont icon-gouwuche"></i>
                    <p class="pi">购物车</p>
                </li>
                <li class="list1">
                    <i class="iconfont icon-wode1"></i>
                    <p class="pi">我的</p>
                </li>
            </ul>
        </div>
        <div class="fi"></div>
    </footer>
</body>
</html>